前言

陣列，是資料處理中很常見的東西，但是你真的懂陣列嗎？
除了基本陣列的樣子，陣列其實還有很多東西可以運用，
但是鯊魚不懂陣列，所以鯊魚要努力學習，為了結實的基礎鯊魚會加油的。

概述

先前有簡略的帶過一次，陣列的本質是有序的集合體，是由一組"[]"及內部的多組數據組成，可以將內部的內容一索引值取出。
最大儲存資料的數量是2^32-1，所以最大索引值是2^32-2(索引從0開始)。
陣列是一個dynamic(動態)物件，可以隨時增加或是減少其內容量。

The Array Constructor(物件建構式)

跟大部分的物件一樣，Array(陣列)在Global Object中有一個"Array" property，這個就是Array(陣列)的原型建構式，創立一個新Array(陣列)的時候都會繼承這個constructor(建構式)，而正因為有constructor(建構式)，創立新物件的也可以透過new去執行，但是也可以直接用Array()。

let shark = new Array();
shark
// []
shark = Array();
shark
// []
let sharkA = new Array("shark",20,30);
sharkA
// (3) ['shark', 20, 30]
let sharkB = ["shark",20,30];
sharkB
// (3) ['shark', 20, 30]

Array可以透過建構式Array，將多組數據陣列化，如上面sharkA所示。
但是如果內容是一個常數，則會變成大小為該常數的空矩陣。

let sharkC = new Array(10)
sharkC
// (10) [empty × 10]

Properties of the Array Constructor

• Array.from ( items [ , mapfn [ , thisArg ] ] )(2022/10/22更新)
  items要轉換成陣列的原型必須是類陣列（array-like）或是可迭代（iterable）物件
  [ , mapfn [ , thisArg ] ]為可選用的參數
  mapFn：事後會介紹，是一個函式會把items的每一個值當作函式的參數做一次演算。
  thisArg：mapFn 函式執行時的 this 對象
  將一個items轉換成一個新的Array陣列。
• Array.isArray ( arg )
  檢驗傳入的arg是否是一個陣列，並用Boolean值回傳結果
• Array.of ( ...items )
  透過...items建立一個新的陣列，跟Array()類似，但是陣列只有一個值且是常數時，僅能用Array.of ( ...items )建立，也就是說Array.of不會管...items的類型，都會建立成一個Array陣列

let sharkC = Array(10)
sharkC
// (10) [empty × 10]
let sharkD = Array.of(10)
// [10]

• Array.prototype
  後續會說到的物件Array.prototype的初始對象，
  其內容為：
  [[Writable]]: false,
  [[Enumerable]]: false,
  [[Configurable]]: false

• get Array [ @@species ]
  是一個訪問器屬性，專門訪問未定義的函數。
  MDN提到這個用法不建議使用，會造成安全性的漏洞

Properties of the Array Prototype Object

• Array.prototype.at ( index )
  依索引值取書陣列中的值，跟String.prototype.at ( index )很類似，都能用負數從後面取值。
• Array.prototype.concat ( ...items )
  將兩個陣列結合並創造出一個新陣列
  MDN的範例

const array1 = ['a', 'b', 'c'];
const array2 = ['d', 'e', 'f'];
const array3 = array1.concat(array2);

array3
// (6)["a", "b", "c", "d", "e", "f"]

• Array.prototype.constructor
  陣列的的原型結構

• Array.prototype.copyWithin ( target, start [ , end ] )
  將陣列的索引值target的內容替換會成同一陣列的其他值
  target, start [ , end ]都是陣列的索引
  以陣列中索引值為target開始，替換成索引值start至end的內容，

• Array.prototype.entries ( )
  將陣列變成一個新的迭代器，可以用.next().value依序取出索引值跟對應的內容。

• Array.prototype.every ( callbackfn [ , thisArg ] )
  callbackfn是一個測試用的函式，通常是一個判斷式，
  [ , thisArg ]是callbackfn呼叫this的值
  用來檢驗陣列中的內容是否都通過callbackfn的測試，並用Boolean值回傳結果

• Array.prototype.fill ( value [ , start [ , end ] ] )
  將陣列的索引值為start的地方開始，值依序變成value，直到索引值end為止。
  如果沒有start就從0開始，沒有end就到最後一個值為止。

• Array.prototype.filter ( callbackfn [ , thisArg ] )
  將通過callbackfn的測試的值留下，並製造出一個新陣列

• Array.prototype.find ( predicate [ , thisArg ] )
  predicate是一個測試用的函式
  將陣列中第一個通過predicate測試的值輸出

• Array.prototype.findIndex ( predicate [ , thisArg ] )
  將陣列中第一個通過predicate測試值的索引輸出，如果沒有則回傳-1

• Array.prototype.flat ( [ depth ] )
  將陣列攤平，也就是將陣列中的陣列解壓縮
  depth表示要解壓縮的層數

• Array.prototype.flatMap ( mapperFunction [ , thisArg ] )
  mapperFunction表示一個函式，
  將陣列解壓縮之後的每個值，作為mapperFunction的參數運作後輸出，並產生一個新陣列

• Array.prototype.forEach ( callbackfn [ , thisArg ] )
  比flatMap更單純，將陣列解壓縮之後的每個值，交給callbackfn運作。

• Array.prototype.includes ( searchElement [ , fromIndex ] )
  檢驗searchElement這個值是否在陣列之中。
  fromIndex表示搜尋的開始索引位置。

• Array.prototype.indexOf ( searchElement [ , fromIndex ] )
  回傳searchElement這個值在陣列中第一個的索引位置
  如果沒有則回傳-1

• Array.prototype.join ( separator )
  separator表示一個連接用的字串
  將陣列所有值透過separator連結成一個字串，
  separator表示連結的東西，如果沒有則是以","代替

• Array.prototype.keys ( )
  將陣列所有的索引輸出成一個陣列迭代。

• Array.prototype.lastIndexOf ( searchElement [ , fromIndex ] )
  跟indexOf類似，只是是陣列中最後一個的索引位置

• Array.prototype.map ( callbackfn [ , thisArg ] )
  將陣列所有值，透過callbackfn運算後得到一個新的陣列

• Array.prototype.pop ( )
  回傳陣列最後一個值，並將那個值從陣列中移除。

• Array.prototype.push ( ...items )
  將...items加入陣列的最後，並回傳新陣列的長度

• Array.prototype.reduce ( callbackfn [ , initialValue ] )
  callbackfn是一個函式，有兩個參數previousValue, currentValue
  currentValue是當前傳述的陣列的值
  previousValue是上一個值放進callbackfn演算的結果，如果沒有上一個則傳入initialValue(如果沒有initialValue，則預設為0)
  將陣列的所有值，依序放進callbackfn作計算，並將計算的結果
  放進下一輪的callbackfn中，影響下一個陣列的值做計算。
  initialValue為影響第一個陣列的值

• Array.prototype.reduceRight ( callbackfn [ , initialValue ] )
  跟reduce類似，不過是反向依序運作

• Array.prototype.reverse ( )
  將陣列的順序反轉，並產生一個新陣列

• Array.prototype.shift ( )
  跟.pop類似不過對象是第一個值。

• Array.prototype.slice ( start, end )
  切割陣列，從索引start切到所以end，並產生一個新陣列
  可以接受負數的索引，
  start的位置一定要比end大

• Array.prototype.some ( callbackfn [ , thisArg ] )
  檢驗陣列是否有值能通過callbackfn的測試，並用Boolean值表示結果

• Array.prototype.sort ( comparefn )
  將陣列排序
  comparefn排序的基準，如果省略則用Unicode值進行排序
  2022/10/22補充
  如果要依數字大小排序
  comparefn 可以用function(A,B){return A-B}

• Array.prototype.splice ( start, deleteCount, ...items )
  在陣列的指定位置插入新的值(...items)
  deleteCount表示刪除索引start位置的值及後面的值，
  0是不刪除
  1是刪除原本start位置的值
  2是刪除原本start位置的值+start位置後面的1個值，以此類推。

• Array.prototype.toLocaleString ( [ reserved1 [ , reserved2 ] ] )
  將陣列的內容轉變成指定語系(reserved1)的結果，
  reserved2表示其他語言配置，可能是數字或是時間

• Array.prototype.toString ( )
  將陣列轉變成一個字串，並將值用以","連結，跟使用join()一樣

• Array.prototype.unshift ( ...items )
  將...items拼接到陣列的前面

• Array.prototype.values ( )
  將陣列的值變成迭代器輸出

• Array.prototype [ @@iterator ] ( )
  將陣列化作迭代器，預設跟values一樣

• Array.prototype [ @@unscopables ]
  @@unscopables其自身和繼承的屬性名稱是從關聯對象的 with 環境綁定中排除的屬性名稱。
  這是目前鯊魚無法理解的東西，等我理解之後會再跟大家說明。

Properties of Array Instances

陣列內部的方法，有兩個

• 一是依索引呼叫其內容
• 二是透過length查看陣列長度

Array Iterator Objects

陣列是一個可以迭代的對象，感覺介紹很常出現迭代，鯊魚會在事後做一篇迭代的介紹，讓大家理解前面說的迭代是甚麼。

結語

陣列是JavaScript很常出現的一種資料類別，如果熟悉陣列的運用一定可以再JavaScript使用上更得心應手，至於Iterator迭代器，不少資料類別都有提到但是初學很少用到，後續鯊魚會好好地介紹他。